(function($) {
   $.widget('ui.showData', {
        options: {

            //данные
            data: [],

            //урл для подгрузки новых данных
            url: false,

            //шаблон
            template: "template.html",

            //префикх назкания шаблонов
            mode_prefix: "table_mode_",

            //текущий шаблон
            mode: 1,

            //функция постоения данных для загрузки
            urlParams: function(){
                return {
                    start: this.data.length
                }
            },

            //тип AJAX запроса
            requestType: 'GET',

            // внутренний элемент в который всё добавляется
            el: false,

            //флаг - идёт загрузка данных
            busy: false,

            //бесконечный скролл
            longScroll: true,

            //флаг - добавить div floatfix вконце отображения
            floatFix: true
        },

        _create: function() {
            this._render();
        },

        //отрисовка
        _render: function() {
            var this_ = this;
            this.options.el = $('<div>');
            this.options.container = this.element;
            this.element.append(this.options.el);

            //загружаем шаблон
            app.main.getTemplate(this.options.template, function(){
                if (this_.options.longScroll) {
                    //вешаем обработчик скрола
                    $(this_.element).scroll(function(){
                        this_._onScroll();
                    })
                }
                this_._buildTable();
            });
        },

        //загружаем данные
        _getData: function(callback) {
            if (!this.options.url) {
                callback(false);
                return;
            }
            $.ajax(
            {
                url: this.options.url,
                dataType: 'json',
                type: this.options.requestType,
                data: this.options.urlParams(),
                success: function(data) {
                    if (app.debug.ajax) console.log('AJAX success', data, this)
                    callback(data);
                },
                error: function(data) {
                    if (app.debug.ajax) console.log('ERROR AJAX load data', this);
                    callback(false);
                }
            });
        },

        //перерисовываем данные
        _buildTable: function() {
            this.options.el.html('');
            if (!this.options.data.length && this.options.url) {
                //если данных нет и указан урл то подгружаем их
                this.add();
                //запускаем колбек
                var this_ = this;
                this.element.one('on_show_data_after_add',function(){
                    this_.element.trigger('on_show_data_after_build',this_);
                });
            } else if (this.options.data.length){
                //рисуем данные
                this._addData(this.options.data, false);
                //запускаем колбек
                this.element.trigger('on_show_data_after_build',this);
            }
        },

        //отрисовка данных
        _addData: function(data, top) {
            //удаляем float fix
            if (this.options.floatFix && !top) {
                this.options.el.find('.floatfix').remove();
            }
            if (top) {
                $.tmpl( this.options.mode_prefix + this.options.mode, data )
                    .prependTo(this.options.el);
            } else {
                $.tmpl( this.options.mode_prefix + this.options.mode, data )
                    .appendTo(this.options.el);
            }
            //добавляем float fix
            if (this.options.floatFix && !top) {
                this.options.el.append("<div style='clear:both' class='floatfix'></div>");
            }
            //запускаем колбек
            this.element.trigger('on_show_data_after_add',this);
        },

        //событие при скроле
        _onScroll: function() {
            //высота контейнера
            var containerH = $(this.element).height();
            //позиция блока с данными
            var elTop = $(this.options.el).position().top;
            //высота блока с данными
            var elH = $(this.options.el).height() || this.options.el[0].scrollHeight;

            if ((elTop - containerH) * -1 > elH - containerH){
                //если остаток скрола сеньше высоты контейнера то добавляем данные
                this.add();
            }
        },

        //добавить данные
        add: function(added_data) {
            var this_ = this;
            if (this.options.busy) return;
            //запускаем колбек
            this.element.trigger('on_show_data_before_add',this_);
            this.options.busy = true;
            var callback = function(data){
                this_.options.busy = false;
                if (data) {
                    this_.options.data = this_.options.data.concat(data);
                    this_._addData(data, false);
                }
            }

            if (added_data) {
                //если есть данные то сразу их добавляем
                callback(added_data);
            } else {
                //иначе - запрашиваем с сервера
                this._getData(callback);
            }
        },

        //добавить данные сверху
        top: function (data) {
            if (!data) return;
            this.options.data = data.concat(this.options.data);
            this._addData(data, true);
        },

        //установка типа отображения
        mode: function(mode) {
            this.options.mode = mode;
            this._buildTable();
        },
        
        //set options
        _setOption: function(key, value) {
            if (value != undefined) {
                this.options[key] = value;
                return this;
            } else {
                return this.options[key];
            }
        }
    });
})(jQuery);

